<template>
  <div class="edit-popup">
    <popup
      ref="popupRef"
      :title="popupTitle"
      :async="true"
      width="550px"
      :clickModalClose="true"
      @confirm="handleSubmit"
      @close="handleClose"
    >
      <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
        <el-form-item label="客户编号" prop="customerId">
          <el-input v-model="formData.customerId" placeholder="请输入客户编号" />
        </el-form-item>
        <el-form-item label="案件类型" prop="caseType">
          <el-select class="flex-1" v-model="formData.caseType" placeholder="请选择案件类型">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="客户代码" prop="customerCode">
          <el-input v-model="formData.customerCode" placeholder="请输入客户代码" />
        </el-form-item>
        <el-form-item label="客户名称(中)" prop="customerNameChinese">
          <el-input v-model="formData.customerNameChinese" placeholder="请输入客户名称(中)" />
        </el-form-item>
        <el-form-item label="客户名称(英)" prop="customerNameEnglish">
          <el-input v-model="formData.customerNameEnglish" placeholder="请输入客户名称(英)" />
        </el-form-item>
        <el-form-item label="客户网址" prop="customerWebsite">
          <el-input v-model="formData.customerWebsite" placeholder="请输入客户网址" />
        </el-form-item>
        <el-form-item label="公司负责人" prop="companyOfficials">
          <el-input v-model="formData.companyOfficials" placeholder="请输入公司负责人" />
        </el-form-item>
        <el-form-item label="所属行业编号" prop="industryInvolvedId">
          <el-input v-model="formData.industryInvolvedId" placeholder="请输入所属行业编号" />
        </el-form-item>
        <el-form-item label="所属行业" prop="industryInvolved">
          <el-input v-model="formData.industryInvolved" placeholder="请输入所属行业" />
        </el-form-item>
        <el-form-item label="业务合作编号" prop="businessCooperationId">
          <el-input v-model="formData.businessCooperationId" placeholder="请输入业务合作编号" />
        </el-form-item>
        <el-form-item label="业务合作" prop="businessCooperation">
          <el-input v-model="formData.businessCooperation" placeholder="请输入业务合作" />
        </el-form-item>
        <el-form-item label="业务人员编号" prop="businessPersonnelId">
          <el-input v-model="formData.businessPersonnelId" placeholder="请输入业务人员编号" />
        </el-form-item>
        <el-form-item label="业务人员" prop="businessPersonnel">
          <el-input v-model="formData.businessPersonnel" placeholder="请输入业务人员" />
        </el-form-item>
        <el-form-item label="业务助理编号" prop="businessAssistantId">
          <el-input v-model="formData.businessAssistantId" placeholder="请输入业务助理编号" />
        </el-form-item>
        <el-form-item label="业务助理" prop="businessAssistant">
          <el-input v-model="formData.businessAssistant" placeholder="请输入业务助理" />
        </el-form-item>
        <el-form-item label="流程人员编号" prop="processPersonnelId">
          <el-input v-model="formData.processPersonnelId" placeholder="请输入流程人员编号" />
        </el-form-item>
        <el-form-item label="流程人员" prop="processPersonnel">
          <el-input v-model="formData.processPersonnel" placeholder="请输入流程人员" />
        </el-form-item>
        <el-form-item label="所属分部编号" prop="subdivisionId">
          <el-input v-model="formData.subdivisionId" placeholder="请输入所属分部编号" />
        </el-form-item>
        <el-form-item label="所属分部" prop="subdivision">
          <el-input v-model="formData.subdivision" placeholder="请输入所属分部" />
        </el-form-item>
        <el-form-item label="客户签约日期" prop="contractedCustomerTime">
          <el-input v-model="formData.contractedCustomerTime" placeholder="请输入客户签约日期" />
        </el-form-item>
        <el-form-item label="成交状态" prop="makebargainStatus">
          <el-radio-group v-model="formData.makebargainStatus" placeholder="请选择成交状态">
            <el-radio label="0">请选择字典生成</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="创建日期" prop="basicsCreateTime">
          <el-input v-model="formData.basicsCreateTime" placeholder="请输入创建日期" />
        </el-form-item>
        <el-form-item label="创建人" prop="basicsCreateName">
          <el-input v-model="formData.basicsCreateName" placeholder="请输入创建人" />
        </el-form-item>
        <el-form-item label="协作人编号" prop="associatesId">
          <el-input v-model="formData.associatesId" placeholder="请输入协作人编号" />
        </el-form-item>
        <el-form-item label="协作人" prop="associates">
          <el-input v-model="formData.associates" placeholder="请输入协作人" />
        </el-form-item>
        <el-form-item label="案源公司编号" prop="caseSourceCompanyId">
          <el-input v-model="formData.caseSourceCompanyId" placeholder="请输入案源公司编号" />
        </el-form-item>
        <el-form-item label="案源公司" prop="caseSourceCompany">
          <el-input v-model="formData.caseSourceCompany" placeholder="请输入案源公司" />
        </el-form-item>
        <el-form-item label="代理等级编号" prop="agencyGradeId">
          <el-input v-model="formData.agencyGradeId" placeholder="请输入代理等级编号" />
        </el-form-item>
        <el-form-item label="代理等级" prop="agencyGrade">
          <el-select class="flex-1" v-model="formData.agencyGrade" placeholder="请选择代理等级">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="客户规模编号" prop="customerSizeId">
          <el-input v-model="formData.customerSizeId" placeholder="请输入客户规模编号" />
        </el-form-item>
        <el-form-item label="客户规模" prop="customerSize">
          <el-input v-model="formData.customerSize" placeholder="请输入客户规模" />
        </el-form-item>
        <el-form-item label="非主力代理人编号" prop="nonPrincipalAgentId">
          <el-input v-model="formData.nonPrincipalAgentId" placeholder="请输入非主力代理人编号" />
        </el-form-item>
        <el-form-item label="非主力代理人" prop="nonPrincipalAgent">
          <el-input v-model="formData.nonPrincipalAgent" placeholder="请输入非主力代理人" />
        </el-form-item>
        <el-form-item label="更新人员编号" prop="uploadsUserId">
          <el-input v-model="formData.uploadsUserId" placeholder="请输入更新人员编号" />
        </el-form-item>
        <el-form-item label="更新人员" prop="uploadsUserName">
          <el-input v-model="formData.uploadsUserName" placeholder="请输入更新人员" />
        </el-form-item>
        <el-form-item label="修改时间" prop="uploadsTime">
          <el-input v-model="formData.uploadsTime" placeholder="请输入修改时间" />
        </el-form-item>
        <el-form-item label="客户系统ip" prop="clientIp">
          <el-input v-model="formData.clientIp" placeholder="请输入客户系统ip" />
        </el-form-item>
        <el-form-item label="客户系统账号" prop="clientAccount">
          <el-input v-model="formData.clientAccount" placeholder="请输入客户系统账号" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="formData.remark" placeholder="请输入备注" />
        </el-form-item>
        <el-form-item label="联系方式" prop="contactInformation">
          <el-input v-model="formData.contactInformation" placeholder="请输入联系方式" />
        </el-form-item>
        <el-form-item label="昵称" prop="nickname">
          <el-input v-model="formData.nickname" placeholder="请输入昵称" />
        </el-form-item>
        <el-form-item label="电话" prop="phone">
          <el-input v-model="formData.phone" placeholder="请输入电话" />
        </el-form-item>
        <el-form-item label="传真" prop="fax">
          <el-input v-model="formData.fax" placeholder="请输入传真" />
        </el-form-item>
        <el-form-item label="邮件" prop="email">
          <el-input v-model="formData.email" placeholder="请输入邮件" />
        </el-form-item>
        <el-form-item label="邮编" prop="postcode">
          <el-input v-model="formData.postcode" placeholder="请输入邮编" />
        </el-form-item>
        <el-form-item label="客户等级编号" prop="clientGradeId">
          <el-input v-model="formData.clientGradeId" placeholder="请输入客户等级编号" />
        </el-form-item>
        <el-form-item label="客户等级" prop="clientGrade">
          <el-select class="flex-1" v-model="formData.clientGrade" placeholder="请选择客户等级">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="信誉等级编号" prop="reputationGradeId">
          <el-input v-model="formData.reputationGradeId" placeholder="请输入信誉等级编号" />
        </el-form-item>
        <el-form-item label="信誉等级" prop="reputationGrade">
          <el-select class="flex-1" v-model="formData.reputationGrade" placeholder="请选择信誉等级">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="保密等级编号" prop="confidentialityGradeId">
          <el-input v-model="formData.confidentialityGradeId" placeholder="请输入保密等级编号" />
        </el-form-item>
        <el-form-item label="保密等级" prop="confidentialityGrade">
          <el-select
            class="flex-1"
            v-model="formData.confidentialityGrade"
            placeholder="请选择保密等级"
          >
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="客户来源编号" prop="customerSourceId">
          <el-input v-model="formData.customerSourceId" placeholder="请输入客户来源编号" />
        </el-form-item>
        <el-form-item label="客户来源" prop="customerSource">
          <el-input v-model="formData.customerSource" placeholder="请输入客户来源" />
        </el-form-item>
        <el-form-item label="客户镇区编号" prop="customerTownshipId">
          <el-input v-model="formData.customerTownshipId" placeholder="请输入客户镇区编号" />
        </el-form-item>
        <el-form-item label="客户镇区" prop="customerTownship">
          <el-input v-model="formData.customerTownship" placeholder="请输入客户镇区" />
        </el-form-item>
        <el-form-item label="客户园区编号" prop="customerGardenId">
          <el-input v-model="formData.customerGardenId" placeholder="请输入客户园区编号" />
        </el-form-item>
        <el-form-item label="客户园区" prop="customerGarden">
          <el-input v-model="formData.customerGarden" placeholder="请输入客户园区" />
        </el-form-item>
        <el-form-item label="客户类型编号" prop="customerTypeId">
          <el-input v-model="formData.customerTypeId" placeholder="请输入客户类型编号" />
        </el-form-item>
        <el-form-item label="客户类型" prop="customerType">
          <el-select class="flex-1" v-model="formData.customerType" placeholder="请选择客户类型">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="内部案源人" prop="internalSource">
          <el-input v-model="formData.internalSource" placeholder="请输入内部案源人" />
        </el-form-item>
        <el-form-item label="内部案源人电话" prop="internalSourcePhone">
          <el-input v-model="formData.internalSourcePhone" placeholder="请输入内部案源人电话" />
        </el-form-item>
        <el-form-item label="内部案源人邮箱" prop="internalSourceEmail">
          <el-input v-model="formData.internalSourceEmail" placeholder="请输入内部案源人邮箱" />
        </el-form-item>
        <el-form-item label="外部案源人" prop="externalCaseSource">
          <el-input v-model="formData.externalCaseSource" placeholder="请输入外部案源人" />
        </el-form-item>
        <el-form-item label="外部案源人电话" prop="externalCasePhone">
          <el-input v-model="formData.externalCasePhone" placeholder="请输入外部案源人电话" />
        </el-form-item>
        <el-form-item label="外部案源人邮箱" prop="externalCaseEmail">
          <el-input v-model="formData.externalCaseEmail" placeholder="请输入外部案源人邮箱" />
        </el-form-item>
        <el-form-item label="案源类型编号" prop="sourceTypeId">
          <el-input v-model="formData.sourceTypeId" placeholder="请输入案源类型编号" />
        </el-form-item>
        <el-form-item label="案源类型" prop="sourceType">
          <el-select class="flex-1" v-model="formData.sourceType" placeholder="请选择案源类型">
            <el-option label="请选择字典生成" value="" />
          </el-select>
        </el-form-item>
        <el-form-item label="账单地址" prop="billingAddress">
          <el-input v-model="formData.billingAddress" placeholder="请输入账单地址" />
        </el-form-item>
        <el-form-item label="缴费抬头" prop="paymentTitle">
          <el-input v-model="formData.paymentTitle" placeholder="请输入缴费抬头" />
        </el-form-item>
        <el-form-item label="纳税人识别号(信用代码)" prop="identificationNumberTaxpayer">
          <el-input
            v-model="formData.identificationNumberTaxpayer"
            placeholder="请输入纳税人识别号(信用代码)"
          />
        </el-form-item>
        <el-form-item label="发票抬头" prop="invoiceTitle">
          <el-input v-model="formData.invoiceTitle" placeholder="请输入发票抬头" />
        </el-form-item>
        <el-form-item label="开户银行" prop="depositBank">
          <el-input v-model="formData.depositBank" placeholder="请输入开户银行" />
        </el-form-item>
        <el-form-item label="银行账号" prop="bankAccount">
          <el-input v-model="formData.bankAccount" placeholder="请输入银行账号" />
        </el-form-item>
        <el-form-item label="年度销售收入" prop="annualSalesRevenue">
          <el-input v-model="formData.annualSalesRevenue" placeholder="请输入年度销售收入" />
        </el-form-item>
        <el-form-item label="一般纳税人" prop="generalTaxpayer">
          <el-input v-model="formData.generalTaxpayer" placeholder="请输入一般纳税人" />
        </el-form-item>
        <el-form-item label="代理费折扣率" prop="agencyDiscountRate">
          <el-input v-model="formData.agencyDiscountRate" placeholder="请输入代理费折扣率" />
        </el-form-item>
        <el-form-item label="开户名称" prop="accountName">
          <el-input v-model="formData.accountName" placeholder="请输入开户名称" />
        </el-form-item>
        <el-form-item label="总资产" prop="totalAssets">
          <el-input v-model="formData.totalAssets" placeholder="请输入总资产" />
        </el-form-item>
        <el-form-item label="电话信息" prop="phoneInfo">
          <el-input v-model="formData.phoneInfo" placeholder="请输入电话信息" />
        </el-form-item>
        <el-form-item label="国家(地区)" prop="nation">
          <el-input v-model="formData.nation" placeholder="请输入国家(地区)" />
        </el-form-item>
        <el-form-item label="省份" prop="province">
          <el-input v-model="formData.province" placeholder="请输入省份" />
        </el-form-item>
        <el-form-item label="城市(中文)" prop="cityChinese">
          <el-input v-model="formData.cityChinese" placeholder="请输入城市(中文)" />
        </el-form-item>
        <el-form-item label="行政区划" prop="administrativeDivision">
          <el-input v-model="formData.administrativeDivision" placeholder="请输入行政区划" />
        </el-form-item>
        <el-form-item label="经营地址" prop="businessAddress">
          <el-input v-model="formData.businessAddress" placeholder="请输入经营地址" />
        </el-form-item>
        <el-form-item label="经营电话" prop="businessPhone">
          <el-input v-model="formData.businessPhone" placeholder="请输入经营电话" />
        </el-form-item>
        <el-form-item label="地址" prop="addressChinese">
          <el-input v-model="formData.addressChinese" placeholder="请输入地址" />
        </el-form-item>
        <el-form-item label="英文地址" prop="addressEnglish">
          <el-input v-model="formData.addressEnglish" placeholder="请输入英文地址" />
        </el-form-item>
        <el-form-item label="其他地址" prop="additionalAddress">
          <el-input v-model="formData.additionalAddress" placeholder="请输入其他地址" />
        </el-form-item>
        <el-form-item label="专利数量" prop="patentQuantity">
          <el-input v-model="formData.patentQuantity" placeholder="请输入专利数量" />
        </el-form-item>
        <el-form-item label="商标数量" prop="numberOfTrademarks">
          <el-input v-model="formData.numberOfTrademarks" placeholder="请输入商标数量" />
        </el-form-item>
        <el-form-item label="版权数量" prop="copyrightNumber">
          <el-input v-model="formData.copyrightNumber" placeholder="请输入版权数量" />
        </el-form-item>
        <el-form-item label="评估依据" prop="evaluationBasis">
          <el-input v-model="formData.evaluationBasis" placeholder="请输入评估依据" />
        </el-form-item>
        <el-form-item label="跟进时间" prop="followUpTime">
          <el-input v-model="formData.followUpTime" placeholder="请输入跟进时间" />
        </el-form-item>
        <el-form-item label="X天未跟进id" prop="unfollowedId">
          <el-input v-model="formData.unfollowedId" placeholder="请输入X天未跟进id" />
        </el-form-item>
        <el-form-item label="X天未跟进" prop="unfollowed">
          <el-input v-model="formData.unfollowed" placeholder="请输入X天未跟进" />
        </el-form-item>
        <el-form-item label="修改人编号" prop="updateUserId">
          <el-input v-model="formData.updateUserId" placeholder="请输入修改人编号" />
        </el-form-item>
      </el-form>
    </popup>
  </div>
</template>
<script lang="ts" setup>
import type { FormInstance } from 'element-plus'
import { customerColEdit, customerColAdd, customerColDetail } from '@/api/customer/customerColList'
import Popup from '@/components/popup/index.vue'
import feedback from '@/utils/feedback'
import type { PropType } from 'vue'
defineProps({
  dictData: {
    type: Object as PropType<Record<string, any[]>>,
    default: () => ({})
  }
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
const popupTitle = computed(() => {
  return mode.value == 'edit' ? '编辑客户列' : '新增客户列'
})

const formData = reactive({
  id: '',
  customerId: '',
  caseType: '',
  customerCode: '',
  customerNameChinese: '',
  customerNameEnglish: '',
  customerWebsite: '',
  companyOfficials: '',
  industryInvolvedId: '',
  industryInvolved: '',
  businessCooperationId: '',
  businessCooperation: '',
  businessPersonnelId: '',
  businessPersonnel: '',
  businessAssistantId: '',
  businessAssistant: '',
  processPersonnelId: '',
  processPersonnel: '',
  subdivisionId: '',
  subdivision: '',
  contractedCustomerTime: '',
  makebargainStatus: '',
  basicsCreateTime: '',
  basicsCreateName: '',
  associatesId: '',
  associates: '',
  caseSourceCompanyId: '',
  caseSourceCompany: '',
  agencyGradeId: '',
  agencyGrade: '',
  customerSizeId: '',
  customerSize: '',
  nonPrincipalAgentId: '',
  nonPrincipalAgent: '',
  uploadsUserId: '',
  uploadsUserName: '',
  uploadsTime: '',
  clientIp: '',
  clientAccount: '',
  remark: '',
  contactInformation: '',
  nickname: '',
  phone: '',
  fax: '',
  email: '',
  postcode: '',
  clientGradeId: '',
  clientGrade: '',
  reputationGradeId: '',
  reputationGrade: '',
  confidentialityGradeId: '',
  confidentialityGrade: '',
  customerSourceId: '',
  customerSource: '',
  customerTownshipId: '',
  customerTownship: '',
  customerGardenId: '',
  customerGarden: '',
  customerTypeId: '',
  customerType: '',
  internalSource: '',
  internalSourcePhone: '',
  internalSourceEmail: '',
  externalCaseSource: '',
  externalCasePhone: '',
  externalCaseEmail: '',
  sourceTypeId: '',
  sourceType: '',
  billingAddress: '',
  paymentTitle: '',
  identificationNumberTaxpayer: '',
  invoiceTitle: '',
  depositBank: '',
  bankAccount: '',
  annualSalesRevenue: '',
  generalTaxpayer: '',
  agencyDiscountRate: '',
  accountName: '',
  totalAssets: '',
  phoneInfo: '',
  nation: '',
  province: '',
  cityChinese: '',
  administrativeDivision: '',
  businessAddress: '',
  businessPhone: '',
  addressChinese: '',
  addressEnglish: '',
  additionalAddress: '',
  patentQuantity: '',
  numberOfTrademarks: '',
  copyrightNumber: '',
  evaluationBasis: '',
  followUpTime: '',
  unfollowedId: '',
  unfollowed: '',
  updateUserId: ''
})

const formRules = {
  caseType: [
    {
      required: true,
      message: '请选择案件类型',
      trigger: ['blur']
    }
  ],
  customerNameChinese: [
    {
      required: true,
      message: '请输入客户名称(中)',
      trigger: ['blur']
    }
  ],
  businessPersonnel: [
    {
      required: true,
      message: '请输入业务人员',
      trigger: ['blur']
    }
  ]
}

const handleSubmit = async () => {
  await formRef.value?.validate()
  const data: any = { ...formData }
  mode.value == 'edit' ? await customerColEdit(data) : await customerColAdd(data)
  popupRef.value?.close()
  feedback.msgSuccess('操作成功')
  emit('success')
}

const open = (type = 'add') => {
  mode.value = type
  popupRef.value?.open()
}

const setFormData = async (data: Record<string, any>) => {
  for (const key in formData) {
    if (data[key] != null && data[key] != undefined) {
      //@ts-ignore
      formData[key] = data[key]
    }
  }
}

const getDetail = async (row: Record<string, any>) => {
  const data = await customerColDetail({
    id: row.id
  })
  setFormData(data)
}

const handleClose = () => {
  emit('close')
}

defineExpose({
  open,
  setFormData,
  getDetail
})
</script>
